<template>
  <div class="content-wrapper">
    <!-- <div class="content-header"></div>
    <div class="title">
      <div>学习记录</div>
    </div>
    <el-divider></el-divider> -->
    <div class="content-container">
      <el-form :inline="true" :model="listQuery" class="filter-container">
        <el-form-item label="培训名称">
          <el-input
            v-model="listQuery.examineeUserName"
            type="text"
            size="mini"
          />
        </el-form-item>
        <el-form-item label="培训类型">
          <el-select v-model="listQuery.examinationUserGroupId" size="mini">
            <el-option
              v-for="item in userGroupOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            class="filter-item"
            size="small"
            round
            type="primary"
            icon="el-icon-search"
            @click="handleFilter"
          >
            搜索
          </el-button>
          <!-- <el-button
            class="filter-item"
            size="small"
            round
            icon="el-icon-download"
            @click="handleFilter"
          >
            导出
          </el-button> -->
        </el-form-item>
      </el-form>
      <el-table
        v-loading="listLoading"
        :data="dataList"
        highlight-current-row
        height="75vh"
        row-key="id"
        lazy
      >
        <!-- <el-table-column type="selection" width="55" /> -->
        <el-table-column label="培训名称" prop="label" min-width="200px" />

        <el-table-column label="培训时间" prop="startTime" width="160px" />
        <el-table-column
          label="培训方式"
          prop="modeName"
          width="150px"
          align="center"
        />
        <el-table-column label="考核方式" prop="assessName" width="150px" />

        <el-table-column label="创建时间" prop="createTime" width="160px" />
        <el-table-column
          label="操作"
          align="center"
          width="150px"
          fixed="right"
        >
          <template slot-scope="{ row }">
            <el-dropdown v-if="row.trainId" trigger="click" class="filter-item">
              <el-button type="text" class="el-icon-more" />
              <el-dropdown-menu slot="dropdown" class="user-dropdown">
                <!--                <el-dropdown-item v-if="row.passFlag == 0" @click.native="viewRecord(row)">批改</el-dropdown-item>-->
                <el-dropdown-item
                  @click.native="viewRecord(row)"
                >查看</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <Pagination
      v-show="total > 0"
      :total="total"
      :page-number.sync="listQuery.pageNumber"
      :page-size.sync="listQuery.pageSize"
      class="pagstyle"
      @pagination="getDataList"
    />
  </div>
</template>

<script>
import { listTrainByClassify } from '@/api/ts/record'
import Pagination from '@/components/Pagination'
export default {
  components: {
    Pagination
  },
  data() {
    return {
      typeList: {
        0: '普通培训',
        1: '文档培训'
      },
      dataList: [],
      total: 0,
      paperOptions: [],
      userGroupOptions: [],
      passFlagOptions: [],
      listQuery: {
        pageIndex: 0,
        pageNumber: 1,
        pageSize: 10,
        examineePaperId: null,
        examineeUserGroupId: null,
        examineeUserName: null,
        passFlag: null
      },
      listLoading: false,
      list: [{}]
    }
  },
  mounted() {
    this.getDataList()
  },
  methods: {
    getDataList() {
      listTrainByClassify({}).then((res) => {
        this.dataList = res.data
      })
    },
    handleFilter() {},
    viewRecord(row) {
      this.$router.push({
        path: '/train/lean_record_detail_page',
        query: { trainId: row.trainId, trainName: row.label }
      })
    }
  }
}
</script>
<style lang="scss">
.content-container {
  height: 80vh;
}
</style>
